import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'

//全局 类似java中的静态类对象
Vue.use(VueRouter)

const routes = [
  {
    path: '/',//url路径
    name: 'Home',//单纯的名字 虽然有点用
    component: Home//对应的路由出现的组件页面，访问/请求应该出现什么页面
  },
  {
    path: '/about',
    name: 'About',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import('../views/About.vue')
  },
  {
    path:'/hellokitty',
    name:'HelloKitty',
    component:()=>import("@/components/HelloKitty.vue"),
    children:[
      {
        //params这种形式进行传参 类似RESTful的形式
        path:'/hellokitty/active/:userkey',
        name:'activelist',//活动管理
        component:()=>import("@/views/mylist/activelist.vue")
      },
      //query这种形式进行传参 啥都不写
      {
        path:'/hellokitty/active2',
        name:'activelist2',
        component:()=>import("@/views/mylist/activelist2.vue")
      },
    ]
  },
  {
    path:'/mylist',
    name:'mylist',
    component:()=>import("@/views/mylist/MyList.vue")
  },
]

const router = new VueRouter({
  routes
})

export default router
